import {Component, OnInit, Input} from '@angular/core';
import {ConfigService} from '@kylin/config';
import {NzMessageService, NzModalService, NzModalRef} from 'ng-zorro-antd';
import {
    HttpClient,
    HttpEvent,
    HttpHeaders,
    HttpEventType,
    HttpRequest,
    HttpResponse
} from '@angular/common/http';

@Component({
    selector: 'kylin-batched-modal',
    templateUrl: './batched-modal.component.html'
})
export class BatchedModalComponent implements OnInit {

    @Input() downloadPath: string;
    @Input() importReqInfo: any;
    @Input() btnInfo: any;
    @Input() funSet: any;
    @Input() accept: string;

    constructor(private message: NzMessageService,
                private modalSvc: NzModalService,
                private config: ConfigService,
                private modalRef: NzModalRef,
                private httpClient: HttpClient) {
    }

    ngOnInit() {
    }

    uploadImportExcel() {
        const uploadEle = document.createElement('input');
        uploadEle.type = 'file';
        uploadEle.setAttribute('accept', this.accept || 'application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
        uploadEle.addEventListener('change', (event) => {
            const file = (event.currentTarget as any).files[0];
            const url = this.importReqInfo.path;
            const formData = new FormData();
            formData.append('file', file);
            if (this.importReqInfo.params) {
                Object.keys(this.importReqInfo.params).map(key => {
                    formData.append(key, this.importReqInfo.params[key]);
                });
            }
            formData.append('type', 2 + '');
            const req = new HttpRequest('POST', url, formData, {
                reportProgress: true,
                withCredentials: true,
                headers: new HttpHeaders({
                    'Upload-type': 'protogenetic',
                    'X-Requested-With': 'XMLHttpRequest'
                })
            });
            this.httpClient.request(req).subscribe((e: HttpEvent<{}>) => {
                if (e.type === HttpEventType.UploadProgress) {
                    if (e.total > 0) {
                        (e as any).percent = e.loaded / e.total * 100;
                        this.btnInfo.loading = true;
                    }
                } else if (e instanceof HttpResponse) {
                    this.btnInfo.loading = false;
                    const body = (e.body as any);
                    if (body.status === 200) {
                        this.message.success('批量导入成功');
                        this.modalRef.close();
                        this.funSet.refreshList();
                    } else {
                        this.message.error('批量导入失败,' + body.message);
                    }
                }
            });
        });
        uploadEle.click();
    }

    downloadImportTemplate() {
        const eleLink = document.createElement('a');
        eleLink.download = '';
        eleLink.style.display = 'none';
        eleLink.href = this.config.imgHostname + this.downloadPath;
        document.body.appendChild(eleLink);
        eleLink.click();
        document.body.removeChild(eleLink);
        this.modalRef.close();
    }
}
